<template>
  <span>
    <span v-show="detail.refundIdentification === '已退款'">
      <el-tag class="ml-5" size="mini" :type="getRefundDetailTagType()">{{ getRefundDetailTip() }}</el-tag>
      <template v-if="detail.refundDetails && detail.refundDetails.length">
        <el-tag
          class="ml-5" size="mini"
          :key="index"
          :type="isDetailRefunded(detail, index) ? 'success' : 'info'"
          v-for="(refundItem, index) in detail.refundDetails">
          {{ refundItem }} 元
          <span>{{ isDetailRefunded(detail, index) ? '（已退）' : '（未退）' }}</span>
        </el-tag>
      </template>
    </span>
  </span>
</template>

<script>
export default {
  props: {
    detail: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {

    };
  },
  methods: {
    // 退款详情tag
    getRefundDetailTagType() {
      return this.isAllRefund() ? 'success' : 'info'
    },
    // 判断是否已退款
    isDetailRefunded(detail, index) {
      if (detail.whetherRefund == 1) {
        // 所有发起的退款都登记了退款
        return true
      } else {
        // 最后一次发起的退款未退
        return detail.refundDetails.length - 1 !== index
      }
    },
    // 退款详情退款提示
    getRefundDetailTip() {
      return this.isAllRefund() ? '财务已标记退款' : '财务未标记退款'
    },
    // 是否全登记退款
    isAllRefund() {
      return this.detail.workRefundId != '-1' && this.detail.whetherRefund == 1
    },
  }
};
</script>
<style lang="scss" scoped>

</style>